<template>
	<view class="distributionDetails">
		<view class="cardDetail flex-column-between">
			<view class="font-weight_bold">
				{{'当前收益('+currency_name+')'}}
			</view>
			<view class="flex-between" >
				<view style="color: #1E6CEB;;font-size: 54rpx;;" class="">
					{{amount.totayIncome}}
				</view>
				<!-- <view class="recharge flex" @click="withdrawal()">
					提现
				</view> -->
			</view>
			<view style="color: rgb(117, 117, 117);" v-if="amount">
				<text class="margin-right_16rpx">{{'今日收益('+currency_name+')'}} {{amount.todayIncome}}</text>
				<text>{{'昨日收益('+currency_name+')'}}  {{amount.yesterdayIncome}}</text>
			</view>
		</view>
		<!-- 	<view class="flex-between margin_40rpx_0 " style="padding: 0 15rpx;">
			<view class="all flex">
				全部
			</view>
			<view class="month">
			
			</view>
		</view> -->
		<!-- 明细列表 -->
		<mescroll-body ref="mescrollRef" :height="windowHeight+'rpx'" @init="mescrollInit" @down="downCallback"
			@up="upCallback" :up="upOption" :down="downOption">

			<block v-for="(item,index) in list">
				<view class="performanceTracking">

					<view class="flex-start-center">
						<view class="margin-right_16rpx">
							
							<image class="headImg" :src="item.url" mode=""></image>
						</view>
						<view class="">
						    <view class="">
						    	{{item.name}}
						    </view>
							<view class="font-overflow" style="width: 545rpx;">
								<text>收益来源:{{item.title}}</text>
							</view>
						
						</view>
					</view>
					<view class="flex-start-center padding-bottom_30rpx border-bottom-f7f7f7" style="margin-left: 95rpx; margin-top: 10rpx;">
						<view v-if="item.type==1" class="achievementType flex">
							<text>搭子</text>
						</view>
						<view v-if="item.type==2" class="serviceType flex">
							<text>服务</text>
						</view>
						<view v-if="item.type==3" class="qunType flex">
							<text>社群</text>
						</view>
						<view class="margin-left_16rpx">
							<text>下单时间:2023-04-22 10:06</text>
						</view>
				
					</view>
					
					<view class="flex-between " >
						<view class="margin-top_20rpx" style="color: #0084FF;">
							{{'实付款：'+item.paid_amount +'('+currency_name+')'}}
						</view>
						<view class="margin-top_20rpx" style="color: #FF0000;">
							{{'预计收益：'+item.amount+'('+currency_name+')'}}
						</view>
					</view>
					
				</view>
			</block>

			<!-- <block v-for="(item,index) in list" :key="index">
				<view class="detailedList">
					<view class="flex-between margin-bottom_20rpx">
						<view class="font-weight_bold">
							{{orderStatusFn(item.operation_source)}}
						</view>
						<view style="color: #A265FC;" class="font-weight_bold">
							{{item.amount_direction==1?'+':'-'}}{{item.amount +(item.amount_type==1?' 余额('+currency_name+')':' 收益('+currency_name+')')}}
						</view>
					</view>
					<view class="flex-between" style="color: rgb(117, 117, 117);;">
						<view class="flex-column-start">
							<text>赠送{{currency_name}}:{{item.gifts_amount}}</text>
							<text v-if="item.amount_type==1"
								style="margin-top: 5rpx;">优惠折扣:{{item.ratio=='0.00'?'0.00':100-Number(item.ratio)}}%</text>
							<text v-if="item.amount_type==2" style="margin-top: 5rpx;">优惠折扣:{{item.ratio}}%</text>
						</view>
						<view class="">
							{{item.amount_type==1?'余额变动':'收益变动'}}
						</view>
					</view>
				</view>
			</block> -->
		</mescroll-body>
	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			const currentDate = this.getDate({
				format: true
			});
			return {
				currency_name: uni.getStorageSync("system").currency_name,
				userInfo: uni.getStorageSync("userInfo"),
				date: null,
				tabIndex: 4,
				currentTime: '2',
				navIndex: 0,
				searchVal: '',

				tabList: [{
					name: '直推粉丝',
					id: '1' //null
				}, {
					name: '间推粉丝',
					id: '2' //null
				}, ],
				yeartime: currentDate.split('-')[0],
				//选择的月份
				monthtime: currentDate.split('-')[1],
				//选择的天数
				daytime: currentDate.split('-')[2],
				token: uni.getStorageSync('login').token,
				downOption: {
					auto: true
				},
				// 上拉配置项
				upOption: {
					auto: false
				},
				token: uni.getStorageSync('login').token,
				windowHeight: '',
				list: [],
				myTeam: null,
				userinfoOj: null,
				amount_type: 1,
				achievementId:null,
				amount:{},
				associateGetInfo:{}
			}
		},
		onLoad(options) {
			// this.amount_type = options.amount_type
			console.log(this.amount_type)
			uni.getSystemInfo({
				success: (res) => {
					this.windowHeight = res.windowHeight * 2 - 800;
				},

			});
			if(options.id){
				this.achievementId=options.id
				
			}
			this.userInformation()
			this.init()
			
		},
		onShow() {
			this.userInformation()
			this.mescroll?.resetUpScroll();

		},
		computed: {
            
			// 订单状态 '1 待审核 2 上架中 3 下架 4 驳回',
			orderStatusFn: function() {
				return function(status) {
					// 1 待接单 2 接单中 3 完成 4 已结算 4拒绝订单
					let orderStatus = '';

					orderStatus =
						status == 0 ? '充值 ' : status == 1 ? '充值' : status == 2 ? '加入搭子' : status == 3 ? '退出搭子' :
						status == 4 ? '搭子完成收益' : status == 5 ? '提现' : status == 6 ? '下单服务' : status == 7 ? '退出服务' :
						status == 8 ? '服务完成' : status == 9 ? '搭子分佣' : status == 10 ? '服务分佣' : status == 11 ?
						'退出搭子补偿' :
						status == 12 ? '加入社区扣除' : status == 13 ? '社区收益' : status == 14 ? '社区分佣' : status == 16 ?
						'后台添加' + this.currency_name : status == 17 ? '后台扣除' + this.currency_name :
						status == 18 ? '查看手机号' : status == 19 ? '退回申请手机号' : status == 20 ? '搭子置顶' : status == 21 ?
						'服务置顶' : status == 22 ? '用户拉新(合伙人)' : status == 23 ? '充值返佣' :
						status == 24 ? '购买vip佣金' : status == 25 ? '聊天扣费' : status == 26 ? '填写资料' : status == 27 ?
						'新用户注册' : status == 28 ? '用户拉新' : status == 29 ? '手机认证' : status == 30 ? '实名认证' : '收益转余额'


					return orderStatus;
				};
			},
			totelName: function() {
				return function(num) {

					if (/^[\u4e00-\u9fa50-9]+$/.test(num)) {
						return num;
					} else {
						if (num >= 10000) {
							let remainder = num % 10000;
							let quotient = Math.floor(num / 10000);
							let decimal = Math.floor(remainder / 1000);
							return quotient + '.' + decimal + '万';
						} else {
							return num.toString();
						}
					}


				};
			}
		},
		methods: {
		
			
			
   //          getPromoterSalesFn(id){
			// 	const res = await this.$http.post({
			// 		url: this.$api.getPromoterSales,
			// 		data: {
				
				
			// 		},
			// 		headers: {
			// 			'Authorization': this.userInfo.token
			// 		}
				
			// 	})
			// 	console.log(res)
			// 	if (res.code == 0) {
					
				
			// 		console.log(res.data)
				
			// 	} else {
				
			// 		this.$sun.toast(res.message, 'none')
			// 	}
			// },
			async init() {



				const res = await this.$http.post({
					url: this.$api.income,
					data: {


					},
					headers: {
						'Authorization': this.userInfo.token
					}

				})
				console.log(res)
				if (res.code == 0) {
					// 跳转到登录页面
					this.myTeam = res.data


					console.log(res.data)

				} else {

					this.$sun.toast(res.message, 'none')
				}
			},
			withdrawal() {
				this.$sun.navGo('/pagesA/personalCenter/applyWithdrawal')
			},
			async userInformation() {
				const result = await this.$http.post({
					url: this.$api.userInfo,
					data: {

					},
					headers: {
						'Authorization': this.userInfo.token
					}

				})

				if (result.code == 0) {
					console.log('data', result.data);
					this.userinfoOj = result.data


				} else {
					this.$sun.toast(result.message, 'none')
				}
			},
			// 日期获取
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;

				return `${year}-${month}-${day}`;

			},

			bindDateChange(e) {


				this.createTime = e.detail.value
				this.date = e.target.value;
				/* 在上面声明变量，split是用来截取字段*/
				this.yeartime = this.date.split('-')[0];
				this.monthtime = this.date.split('-')[1];
				this.daytime = this.date.split('-')[2];


			},

			async upCallback(scroll) {

				const result = await this.$http.post({
					url: this.$api.getPromoterSales,
					data: {
						page: scroll.num,
						limit: 10,
						id:this.achievementId
						// id:1460


					},
					headers: {
						'Authorization': this.userInfo.token
					}

				})
				if (result.code == 0) {
					console.log('地址管理列表', result);
					this.count = result.data.count
					this.mescroll.endByPage(result.data.list.length, this.$sun.pagingSum(result.data.count, 10));
					if (scroll.num == 1) this.list = [];
					this.list = this.list.concat(result.data.list);
					this.amount=result.data.amount
					console.log('this.list', this.list, this.list.length);
				}
			},

		},

	}
</script>

<style lang="less" scoped>
	page {
		background: #f6f6f6;
		
	}
   
	.distributionDetails {
		padding: 20rpx;
		.performanceTracking{
			margin-bottom: 10rpx;
			   padding: 20rpx;
			   background-color: #fff;
			   
			   
			   .headImg{
				   width: 76rpx;
				   height: 76rpx;
				   border-radius: 50%;
			   }
			   .achievementType{
				   color: #fff;
				   width: 68rpx;
				   height: 34rpx;
				   background: rgb(0, 76, 245);
				   border-radius: 12rpx;
			   }
			   .serviceType{
				   color: #fff;
				   width: 68rpx;
				   height: 34rpx;
				   background: rgb(3, 200, 204);
				   border-radius: 12rpx;
			   }
			   .qunType{
				   color: #fff;
				   width: 68rpx;
				   height: 34rpx;
				   background:  #8756F5;
				   border-radius: 12rpx;
				 
			   }
		}
		.cardDetail {
			margin-bottom: 20rpx;
			height: 260rpx;
			border-radius: 10rpx;

			background: rgb(255, 255, 255);
			padding: 40rpx;

			.recharge {
				width: 152rpx;
				height: 68rpx;
				border-radius: 200rpx;
				color: rgb(255, 255, 255);
				background: #1E6CEB;
			}
		}

		.all {
			width: 102rpx;
			height: 46rpx;
			border-radius: 10rpx;
			color: rgb(255, 255, 255);
			background: rgb(255, 0, 0);
		}

		.detailedList {

			// height: 152rpx;
			border-radius: 10rpx;
			padding: 20rpx;
			background: rgb(255, 255, 255);
		}

		.performanceList {


			padding: 30rpx;
			background-color: #fff;
			margin-bottom: 20rpx;

			.normal {
				width: 70rpx;
				height: 40rpx;
				border-radius: 5px;
				color: #fff;
				background: rgb(0, 183, 0);
			}

			.disable {
				width: 70rpx;
				height: 40rpx;
				border-radius: 5px;
				color: #fff;
				background: red;
			}

			.headImg {
				width: 96rpx;
				height: 96rpx;
				border-radius: 50%;
			}
		}

		.performanceDetailedList {

			margin-bottom: 20rpx;
			background-color: #fff;
			padding: 20rpx;

			.headImg {
				width: 46rpx;
				height: 46rpx;
				border-radius: 50%;
			}

			.bgBlue {
				width: 30%;
				height: 64px;
				background: rgb(245, 249, 253);
			}

		}
	}
</style>